<div id="products_block">
    <div id="product_photo">
	<div class="customScrollBox">
		<!-- horWrapper div is important for horizontal scrollers! -->
		<div class="horWrapper"> 
		<div class="container">
    		<div class="content">
            	    <?
                        foreach($product->src as $src){
                            $src_big = str_replace('_min', '', $src);
                            echo "<a rel=\"prettyPhoto[1]\" href=\"$src_big\"><img src=\"$src\"/></a>";
                        }
                    ?>
		</div>
		</div>
		<div class="dragger_container">
    		<div class="dragger"></div>
		</div>
		</div>
	</div>
        <!--<a href="#" class="scrollUpBtn">&#8678;</a> <a href="#" class="scrollDownBtn">&#8680;</a>-->
    </div>
    
    <div id="product_content">
        <h1><?= $product->name?></h1>
        <p><span>Тип:</span> <?= $product->type ?></p>
        <p><span>Пол:</span> <?= $product->sex ?></p>
        <p><span>Размер:</span> длина <?= $product->width ?>, высота <?= $product->height ?></p>
        <p><span>Описание:</span> <?= $product->content ?></p>
        <p><span>Комплектация:</span> <?= $product->complectation ?></p>
        <div class="in_cart" id="<?= $product->id ?>" name="<?= $product->name ?>" href="<?= $product->href ?>" price="<?= $product->price ?>">В корзину</div>
        <div class="price"><?= $product->price ?> р.</div>
    </div>
</div>

<?= View::factory('catalogue/cart')->render() ?>

<script type="text/javascript">
    $(document).ready(function(){
        $("#product_content .in_cart").bind('click', function(){
            var product = {};
            product.id = $(this).attr('id');
            product.name = $(this).attr('name');
            product.href = $(this).attr('href');
            product.price = $(this).attr('price');
            product.quantity = 1;
            cart.add(product);
        });
        
        
        $("a[rel^='prettyPhoto']").prettyPhoto({
			opacity: 0.80, /* Value between 0 and 1 */
			show_title: false, /* true/false */
			allow_resize: true, /* Resize the photos bigger than viewport. true/false */
			default_width: 500,
			default_height: 344,
			counter_separator_label: '/', /* The separator for the gallery counter 1 "of" 2 */
			theme: 'facebook', /* light_rounded / dark_rounded / light_square / dark_square / facebook */
			horizontal_padding: 20, /* The padding on each side of the picture */
			hideflash: false, /* Hides all the flash object on a page, set to TRUE if flash appears over prettyPhoto */
			deeplinking: false, /* Allow prettyPhoto to update the url to enable deeplinking. */
			overlay_gallery: false, /* If set to true, a gallery will overlay the fullscreen image on mouse over */
			keyboard_shortcuts: true, /* Set to false if you open forms inside prettyPhoto */
			social_tools: false/* html or false to disable */
	});
        
    });

    $(window).load(function() {
	$("#product_photo").mCustomScrollbar("horizontal",500,"easeOutCirc",1,"fixed","yes","yes",20); 
});

</script>